import './index.less';
import { View , Input , Icon , Image , Text} from "@tarojs/components";
import Taro from "@tarojs/taro";
import { useEffect , useState } from 'react';
import http from '../../../utils/http';
function Search() {
  const [courseList,setCourseList]=useState([])
  const [list,setList]=useState([])
  useEffect(()=>{
    http({
      url:'/home/getAllCourse'
    }).then(res=>{
      setList(res.data.data)
    });
  },[])
  return<View id="search">
    <View className="header">
      <View className="back" onClick={()=>{Taro.navigateBack({delta: 1})}}>《</View>
      <View className="search">
        <Icon size='14' type='search'/>
        <Input type='text' placeholder='搜索' focus onInput={(ev)=>{setCourseList(list.filter(v=>v.title.indexOf(ev.target.value)!=-1))}}></Input>
      </View>
    </View>
    {courseList.length?courseList.map((v,i)=><View key={i} className="courseList" onClick={()=>{Taro.navigateTo({url:'/pages/home/course/index?id='+v.id})}}>
      <Image src={v.course_img_url} className="img"></Image>
      <View className="con">
        <Text className="title">{v.title}</Text>
        <Text className="type">培训类型：{v.type}</Text>
      </View>
    </View>):[<View className="image" key="-1"></View>,
    <View className="nothing" key="-2">暂无结果</View>]}
  </View>;
}
export default Search;